<template>
  <div class="flex flex-col h-full">
    <SearchContainer @search="getData(), getDataTwo()" @reset="() => formRef.resetFields()">
      <a-form ref="formRef" class="form-style-flex" :model="formState" :label-col="{ style: { width: '70px' } }">
        <a-form-item name="dateRange" label="日期范围" class="w-80 mr-5">
          <a-range-picker v-model:value="formState['dateRange']" format="YYYY-MM-DD" value-format="YYYY-MM-DD" @change="getCzyData()" />
        </a-form-item>
        <a-form-item label="收费员" name="czy" class="w-72">
          <a-select v-model:value="formState.czy" mode="multiple" :max-tag-count="2" placeholder="请选择" :options="wardData" @change="onSelectCzyChange" />
        </a-form-item>
      </a-form>
    </SearchContainer>
    <a-card class="mt-2 flex-1">
      <!-- <div class="flex justify-end mb-2">
          <BaseExport type="门诊" name="退费检索" code="000061" is-show-time :search-params="formState">导出</BaseExport>
        </div> -->
      <BaseTitle title="按支付方式统计报表">
        <div>
          <BaseExport type="门诊" name="按支付方式统计报表" code="000639" is-show-time :search-params="formState">导出</BaseExport>
        </div>
      </BaseTitle>
      <BaseTable :loading="loading" column-code="000639" :scroll="{ x: 2000 }" :data-source="tableData" bordered>
        <!-- <template v-if="column.dataIndex === 'action'">
              <a-button type="link" size="small" @click="onPrint(record)"> 补打收据 </a-button>
            </template> -->
      </BaseTable>
      <BaseTitle title="按发票分类统计报表" class="mt-4">
        <div>
          <BaseExport type="门诊" name="按发票分类统计报表" code="000640" is-show-time :search-params="formState">导出</BaseExport>
        </div>
      </BaseTitle>
      <BaseTable :loading="loadingTwo" column-code="000640" :scroll="{ x: 3200 }" :data-source="tableDataTwo" bordered>
        <!-- <template #bodyCell="{ column, index, record }">
            <template v-if="column.dataIndex === 'action'">
              <a-button type="link" size="small" @click="onPrint(record)"> 补打收据 </a-button>
            </template>
          </template> -->
      </BaseTable>
    </a-card>
  </div>
</template>

<script setup>
import { ref, onMounted, reactive } from 'vue'
import dayjs from 'dayjs'
import { message } from 'ant-design-vue'
import SearchContainer from '@/components/SearchContainer'
import { post } from '@/utils/request'
import userStore from '@/store/user'

const { empId } = userStore()
const formRef = ref(null)
const wardData = ref([])
const formState = reactive({
  dateRange: [dayjs().format('YYYY-MM-DD'), dayjs().format('YYYY-MM-DD')],
  zjm: '',
  pjhm: '',
  sftfbz: '3',
  czy: []
})
const { loading, tableData, getData } = useTable({
  url: '/outp/oupCharge/getChargeByPaymentList',
  pagination: false,
  formatParams: () => {
    return {
      stdate: formState.dateRange?.[0],
      eddate: formState.dateRange?.[1],
      czy: formState.czy
    }
  },
  onSuccess: async () => {
    const { code, data } = await post('/common/util/getTableMappingCloumnList', { id: '000639' })
    const newRow = {
      czy: '总合计',
      sfymc: '-'
    }
    if (code === 0 && data && data.length > 0) {
      data.forEach((item) => {
        if (item.title !== '收费员编号' && item.title !== '收费员') {
          newRow[item.dataIndex] = tableData.value.reduce((pre, next) => {
            return pre + Number(next[item.dataIndex])
          }, 0)
        }
      })
      tableData.value.push(newRow)
    }
  }
})
const {
  loading: loadingTwo,
  tableData: tableDataTwo,
  getData: getDataTwo
} = useTable({
  url: '/outp/oupCharge/getChargeByXmlbList',
  pagination: false,
  formatParams: () => {
    return {
      stdate: formState.dateRange?.[0],
      eddate: formState.dateRange?.[1],
      czy: formState.czy
    }
  },
  onSuccess: async () => {
    const { code, data } = await post('/common/util/getTableMappingCloumnList', { id: '000640' })
    const newRow = {
      czy: '总合计',
      sfymc: '-'
    }
    if (code === 0 && data && data.length > 0) {
      data.forEach((item) => {
        if (item.title !== '收费员编号' && item.title !== '收费员') {
          newRow[item.dataIndex] = tableDataTwo.value.reduce((pre, next) => {
            return pre + Number(next[item.dataIndex])
          }, 0)
        }
      })
      tableDataTwo.value.push(newRow)
    }
  }
})
const isDeptPermissions = ref(false)
const isAllPermissions = ref(false)
// 获取数据权限
const getSystemList = async () => {
  const { code, data } = await post('/operation/opex/getEmpSystemDataPermissionsList', { empId })
  if (code !== 0) return message.error('获取数据权限失败')
  isDeptPermissions.value = data.some((i) => i.permissonCode === 'system:data:view_dept_charge_statistics')
  isAllPermissions.value = data.some((i) => i.permissonCode === 'system:data:view_all_charge_statistics')
  getCzyData()
}
// 收费员
const getCzyData = async () => {
  const res = await post('/outp/mzdj/getTollCollectors', {
    stdate: formState.dateRange?.[0],
    eddate: formState.dateRange?.[1]
  })
  wardData.value = res.data.map((item) => {
    return {
      label: item.empName,
      value: item.empId
    }
  })
  if (isAllPermissions.value) {
    formState.czy = []
  } else {
    if (isDeptPermissions.value) {
      if (wardData.value.length > 0) {
        formState.czy = []
        wardData.value.forEach((item) => {
          if (item) formState.czy.push(item.value)
        })
      } else {
        formState.czy = []
      }
    } else {
      formState.czy = [empId]
    }
  }
  // if (!isDeptPermissions.value && !isAllPermissions.value && wardData.value.length === 1) {
  //   formState.value.czy = [wardData.value[0]?.value]
  // }
  getData()
  getDataTwo()
}
const onSelectCzyChange = () => {
  getData()
  getDataTwo()
}

onMounted(() => {
  getSystemList()
  // getData()
  // getDataTwo()
})
</script>
<style lang="less" scoped>
.ant-picker {
  width: 100%;
}
</style>
